Skip to content

feat: add loading skeleton distinct from not-found state to stream details page (Closes #1088) - #1155

Merged
ogazboiz merged 3 commits into
LabsCrypt:mainfrom
sojetunde8:fix/issue-1088-loading-skeleton-stream-details
Aug 3, 2026
Merged

feat: add loading skeleton distinct from not-found state to stream details page (Closes #1088)#1155
ogazboiz merged 3 commits into
LabsCrypt:mainfrom
sojetunde8:fix/issue-1088-loading-skeleton-stream-details

Conversation

@sojetunde8

Copy link
Copy Markdown
Contributor

Closes #1088

Summary

  • Replace the minimal spinner loading state with a full-page skeleton UI that mimics the stream details layout: header, overview, stats cards, progress bar, action buttons, and event history
  • Each skeleton element uses animate-pulse shimmer placeholders styled to match the dark theme
  • The not-found/error state remains visually distinct with a red AlertTriangle icon — no risk of confusing the two states
  • Loading region has proper role="status" and aria-label for accessibility

Testing

  • Added 4 unit tests covering: skeleton renders while fetch is in-flight, transition from skeleton to content on success, transition from skeleton to not-found on 404, and error message display on API failure

@ogazboiz ogazboiz left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice work. the structured skeleton mirrors the page layout with role=status and a proper aria-label, the not-found state stays distinct, and the four transition tests (pending to skeleton, success, 404) are exactly the right coverage for #1088. green after rebase. merging. if you want to keep contributing, join us on Telegram: https://t.me/+DOylgFv1jyJlNzM0

@ogazboiz
ogazboiz merged commit 8f844bb into LabsCrypt:main Aug 3, 2026
10 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Frontend] stream-details-content.tsx has no loading skeleton distinct from the not-found state, so both render the same blank layout briefly

2 participants